@charset "utf-8";
body{
    width: calc(360rem/18);
    font-size: 18px;
    background-color: #f2f2f2;
    /*height: 10000px;*/
}
.header{
    width: 100%;
    height: calc(40rem/18);
    background-color: #fff;
    position: relative;
    text-align: center;
}
.page{
    position: absolute;
    top: 0;
    left: 0;
    background: url(https://i.h2.pdim.gs/6cf04297e7c8972420dd2a319aabe879.png) center center no-repeat;
    background-size: calc(9.56rem/18) calc(18rem/18);
    /*width: calc(20.25rem/18);*/
    height: 100%;
    padding-left: calc(39.37rem/18);
}
.title{
    display: inline-block;
    width: calc(29.5rem/18);
    height: calc(40rem/18);
    font-size: calc(14.6rem/18);
    line-height: calc(40rem/18);
}
.list-box{
    width: calc(354.4rem/18);
    margin-top: calc(9rem/18);
    background-color: #fff;
    padding-top: calc(6.7rem/18);
    padding-left: calc(5.6rem/18);
    overflow: hidden;
}
.list{
    width: calc(112.5rem/18);
    height: calc(181.12rem/18);
    display: inline-block;
    margin-right: calc(5.62rem/18);
    margin-bottom: calc(6.75rem/18);
    float: left;
    box-shadow: 0 5px 5px rgba(0,0,0,.1);
}
.list-img{
    width: calc(112.5rem/18);
    height: calc(159rem/18);
}
.list-img img{
    width: 100%;
}
.list-name{
    font-size: calc(11.25rem/18);
    line-height: calc(22.5rem/18);
    color: #4a4a4a;
    text-align: center;
}